<template>
  <div>
    <div class="toolbar">
      <el-form :inline="true" :model="q" size="mini">
        <el-form-item label="时间:">
          <el-date-picker v-model="q.start_day" value-format="yyyy-MM-dd" type="date"
                          :picker-options="pickerOptions" placeholder="选择日期"></el-date-picker>
          <span>-</span>
          <el-date-picker v-model="q.end_day" value-format="yyyy-MM-dd" type="date"
                          :picker-options="pickerOptions" placeholder="选择日期"></el-date-picker>
        </el-form-item>
        <el-form-item label="关联主管:"  >
          <more-selete v-if="managerArray &&restInit" :dataList="managerArray" @checkedMore="q.manager_list= $event" :placeholder="'请选择主管'"></more-selete>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="query">查询</el-button>
          <el-button type="danger" @click="reload">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-row type="flex" class="row-bg btn-row" justify="end">
      <el-button type="danger" size="mini" @click="deletes" :disabled="multipleSelection.length===0">批量删除</el-button>
      <el-button size="mini" @click="add" type="primary" icon="el-icon-plus">数据配置</el-button>
    </el-row>
    <el-table @selection-change="handleSelectionChange" :data="listData.list" v-loading.body="listLoading" @sort-change="sortlist" size="mini" stripe border fit highlight-current-row>
      <el-table-column   type="selection"   width="55" fixed="left">  </el-table-column>
      <el-table-column prop="_id" label="配置ID"  width="150"  ></el-table-column>
      <el-table-column prop="day" label="日期"  width="150"  > </el-table-column>
      <el-table-column prop="manager" label="关联主管" width="100"  ></el-table-column>
      <el-table-column prop="register_count" label="激活"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.register_count.adjustment_by]+'，'+[scope.row.adjustment_dct.register_count.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="bind_count" label="注册"  width="120"  >
        <template  slot-scope="scope">
              {{adjustmentList[scope.row.adjustment_dct.bind_count.adjustment_by]+'，'+[scope.row.adjustment_dct.bind_count.ratio]}}
      </template>
      </el-table-column>
      <el-table-column prop="first_recharge_user" label="首充人数" width="120">
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.first_recharge_user.adjustment_by]+'，'+[scope.row.adjustment_dct.first_recharge_user.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="first_recharge_count" label="首充金额" width="120">
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.first_recharge_count.adjustment_by]+'，'+[scope.row.adjustment_dct.first_recharge_count.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="recharge_new_user" label="新充人数" width="120" >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.recharge_new_user.adjustment_by]+'，'+[scope.row.adjustment_dct.recharge_new_user.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="recharge_new_amount" label="新充金额"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.recharge_new_amount.adjustment_by]+'，'+[scope.row.adjustment_dct.recharge_new_amount.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="recharge_user" label="充值人数"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.recharge_user.adjustment_by]+'，'+[scope.row.adjustment_dct.recharge_user.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="recharge_amount" label="充值金额"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.recharge_amount.adjustment_by]+'，'+[scope.row.adjustment_dct.recharge_amount.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="agency_recharge" label="代理充值"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.agency_recharge.adjustment_by]+'，'+[scope.row.adjustment_dct.agency_recharge.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="online_recharge" label="在线充值"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.online_recharge.adjustment_by]+'，'+[scope.row.adjustment_dct.online_recharge.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="withdraw_amount" label="提现"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.withdraw_amount.adjustment_by]+'，'+[scope.row.adjustment_dct.withdraw_amount.ratio]}}
        </template>
      </el-table-column>
      <el-table-column prop="real_channel_tax_amount" label="实际税收"  width="120"  >
        <template  slot-scope="scope">
          {{adjustmentList[scope.row.adjustment_dct.real_channel_tax_amount.adjustment_by]+'，'+[scope.row.adjustment_dct.real_channel_tax_amount.ratio]}}
        </template>
      </el-table-column>
      <el-table-column label="操作" width="145" fixed="right">
        <template slot-scope="scope">
          <div>
            <el-button type="primary" size="mini" @click="update(scope.row)">编辑</el-button>
            <el-button type="danger" size="mini" @click="remove(scope.row)">删除</el-button>
          </div>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination  @size-change="handleSizeChange" @current-change="handleCurrentChange"
                      :current-page="q.page_no" :page-sizes="$store.state.app.pageSizeArr"
                      :page-size="q.page_size"
                      layout="total, sizes, prev, pager, next, jumper"
                      :total="listData.total" />
    </div>
    <save-update v-if="showUpdate" :adjustmentList="adjustmentList" :showUpdate.sync="showUpdate" :Detail="Detail" :managerlist="managerlist"></save-update>
  </div>
</template>

<script>
  import MoreSelete from '@/components/MoreSelete/index'
  import saveUpdate from './saveUpdate'
  import { getConfigInfoList, deleteConfigInfo, getChnOptions,getadjustmentInfoList } from '@/api'
  import {queryFilter} from '@/utils/patch'
  export default {
    components: {saveUpdate,MoreSelete},
    data() {
      return {
        listData: {},
        q: {page_size: 30, page_no: 1 },
        listLoading: false,
        showUpdate: false,
        show_id: null,
        restInit: true,
        managerlist: [],
        managerArray: [],
        leaderlist: [],
        leaderArray: [],
        Detail: {},
        pickerOptions: {
          disabledDate(time) {
            return time.getTime() > Date.now() - 8.64e6
          }
        },
        roles:[],
        multipleSelection: [],
        adjustmentList:{},
      }
    },
    mounted(){
      this.getList()
      this.getManagerList()
      this.getroles()
      this.getadjustmentInfoList()
    },
    created(){
    },
    deactivated(){
      this.listLoading = false
    },
    methods: {
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },
      getroles(){
        this.roles=this.$store.state.user.roles.map(item=>{
          return item.id
        })
      },
      add(){
        this.show_id = null
        this.Detail = {}
        this.showUpdate = true
      },
      update(row){
        this.Detail =Object.assign({},row,{id:row._id})
        this.showUpdate = true
      },
      deletes(){
        let inputValue=''
        this.multipleSelection.map(item=>{
          inputValue+=`<div><span class="color-blue">${item._id}</span>&nbsp;&nbsp;(${item.day}&nbsp;&nbsp;${item.manager})</div>`
        })
        this.$confirm(`确定删除以下配置？（共<span class="color-red">${this.multipleSelection.length}</span>条）${inputValue}`, '批量删除', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          dangerouslyUseHTMLString:true,
        }).then(() => {
          let adjustment_id_list=this.multipleSelection.map(item=>item._id)
          deleteConfigInfo({adjustment_id_list}).then(res => {
            if(res.status === 0){
              this.$message({ type: 'success', message: '删除成功!' })
              this.getList()
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
      },
      remove(row){
        this.$confirm(`是否确定删除【${row.day}】【${row.manager}】的数据配置？`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {

          let adjustment_id_list=[row._id]
          deleteConfigInfo({adjustment_id_list}).then(res => {
            if(res.status === 0){
              this.$message({ type: 'success', message: '删除成功!' })
              this.getList()
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
      },
      query(){
        this.q = Object.assign(this.q, {page_no: 1, page_size: 30})
        this.getList()
      },
      reload() {
        this.restInit = false
        this.$nextTick(() => (this.restInit = true))
        this.q = {page_size: 30, page_no: 1}
        this.getList()
      },
      sortlist(sort){
        this.q.$orderby = sort.prop
        this.getList()
      },
      handleSizeChange (val) {
        this.q.page_size = val
        this.getList()
      },
      handleCurrentChange (val) {
        this.q.page_no = val
        this.getList()
      },
      getadjustmentInfoList(){
        getadjustmentInfoList().then(res => {
          if(res.status === 0){
            this.adjustmentList=res.data
            Reflect.ownKeys(this.adjustmentList).forEach(item=> {
              this.adjustmentList[item]=this.adjustmentList[item].name
            })
          }
        })
      },
      async getManagerList(){
        await getChnOptions({data_type: 'manager'}).then(res => {
          if(res.status === 0){
            this.managerlist = res.data
            this.managerArray = []
            this.managerlist.map(item => {
              this.managerArray.push(item.name)
            })
          }
        })
      },
      getList(){
        let queryObj = queryFilter(this.q)

        if(queryObj.manager_list){
          queryObj = Object.assign({}, queryObj, {manager_list: `${JSON.stringify(queryObj.manager_list)}`} )
        }
        getConfigInfoList(queryObj).then(res => {
          if(res.status === 0){
            this.listLoading = false
            this.listData = res.data
          }
        })
      }
    },
    watch: {
      showUpdate() {
        if(!this.showUpdate){
          this.getList()
        }
      }
    }
  }
</script>
